<template>
	<view class="page">
		<view class="expressinfo-box">
			<view class="cell-item">
				<view class="left-box">
					快递名称
				</view>
				<view class="right-box">
					{{signInfo.signDetailDTO.logisticsName ? signInfo.signDetailDTO.logisticsName : ''}}
				</view>
			</view>
			<view class="cell-item">
				<view class="left-box">
					物流单号
				</view>
				<view class="right-box">
					{{signInfo.signDetailDTO.logisticsNo ? signInfo.signDetailDTO.logisticsNo : ''}}
				</view>
			</view>
			<view class="cell-item">
				<view class="left-box">
					供应商
				</view>
				<view class="right-box">
					{{signInfo.signDetailDTO.salesCompanyName ? signInfo.signDetailDTO.salesCompanyName : ''}}
				</view>
			</view>
			<view class="cell-item">
				<view class="left-box">
					收货人
				</view>
				<view class="right-box" v-if="signInfo.signDetailDTO.receiveUser">
					{{signInfo.signDetailDTO.receiveUser ? signInfo.signDetailDTO.receiveUser : ''}}
				</view>
			</view>
			<view class="cell-item">
				<view class="left-box">
					收货时间
				</view>
				<view class="right-box" v-if="signInfo.signDetailDTO.receiveTime">
					{{signInfo.signDetailDTO.receiveTime ? signInfo.signDetailDTO.receiveTime : ''}}
				</view>
			</view>
			<view class="cell-item">
				<view class="left-box">
					退货状态
				</view>
				<view class="right-box">
					待签收
				</view>
			</view>
		</view>
		
		<view class="product-box">
			<view class="title">
				退货物料
			</view>
			<view class="card-box" v-for="(item,index) in signInfo.signDetailDTO.materials" :key="index">
				<view class="card-item" @click="materialOpen(index)">
					<view class="product-img">
						<image class="img" src="/static/image/img_icon.png" mode="aspectFit"></image>
					</view>
					<view class="product-info">
						<view class="product-name">
							{{item.materialShortName}}
						</view>
						<view class="productid">
							{{item.materialNo}}
						</view>
						<view class="productattr">
							{{item.paramstr}}
						</view>
						<view class="info">
							<view class="item">
								{{item.materialCount ? item.materialCount : ''}}{{item.materialUnit}}{{item.twoUnit ? '/' + item.twoUnit : ''}}
							</view>
							<view class="item">
								{{sourceList[item.source]}}
							</view>
							<view class="item">
								{{natureList[item.nature]}}
							</view>
						</view>
					</view>
				</view>
				<view class="received-box">
					<view class="left-box">
						<view class="received-title" v-if="item.materialSignCount && item.materialSignCount != 0">
							已收货：
						</view>
						<view class="received-num" v-if="item.materialSignCount && item.materialSignCount != 0">
							{{item.materialSignCount}}
						</view>
					</view>
					<view class="right-box" @click="batchOpen(index)" v-if="signInfo.signDetailDTO.status != '1'">
						查看批次
					</view>
				</view>
				<view class="cell-item" v-if="signInfo.signDetailDTO.status == '1'">
					<view class="left-box">
						<view class="cell-title">
							收货数量：
						</view>
						<input class="input" v-if="!storehousesType && !materialType" type="number"
							@input="signInNumChange($event,index)" value="" />
						<view class="sign">
							克
						</view>
					</view>
					<view class="right-box">
						<view class="cell-title">
							工序
						</view>
						<view class="value" @click="goworkproedure(index)">
							{{item.workproedure.processName}}
						</view>
					</view>
				</view>
				<view class="remark">
					备注：{{item.remark ? item.remark : ''}}
				</view>
			</view>
		</view>
		<view class="button-box">
			<view class="button" @click="signfor">
				扫库位码签收
			</view>
			<!-- <view class="button">
				添加物流信息
			</view> -->
		</view>
		<batch v-if="batchType" :batchArray="batchInfo" @close="batchClose"></batch>
		<material :info="materialInfo" v-if="materialType" @close="materialClose"></material>
		<storehouses :info="storehouseInfo" v-if="storehousesType" @close="storehousesClose"
			@confirm="signInStorehouses"></storehouses>
	</view>
</template>

<script>
	import batch from '@/subcontractList/order/purchase/component/dialog/batch';
	import material from '@/subcontractList/order/purchase/component/dialog/material';
	export default {
		components:{
			material,batch
		},
		data() {
			return {
				id: null, // 详情id
				batchInfo: [], // 批次信息
				signInfo: {}, // 物料签收详情
				statusList: [ // 订单状态列表
					'', '待签收', '待确认入库', '已签收', '拒收', '数量差异'
				],
				sourceList: [ // 产品来源列表
					'外购', '自制', '委外', '外协'
				],
				natureList: [ // 产品性质列表
					'成品', '半成品', '原材料'
				],
				storehouseInfo: {}, // 库位信息
				processesInfo: {}, // 工序信息
				materialInfo: {}, // 物料信息
				batchType: false, // 查看批次悬浮窗显示状态
				materialType: false, // 物料信息弹窗显示状态
				storehousesType: false, // 库位悬浮窗弹窗显示状态
			}
		},
		onLoad(option) {
			if (option.id) {
				this.id = option.id;
				this.init();
			}
		},
		onShow() {
			let selected = getApp().globalData.selected;
			if (selected != null) {
				if (selected.info) {
					let signInfo = this.signInfo;
					console.log(selected);
					if (selected.info.id) {
						this.$set(signInfo.signDetailDTO.materials[selected.index], 'workproedure', selected.info);
						this.signInfo = signInfo;
					}
					getApp().globalData.selected = null;
				}
			}
		},
		methods: {
			/**
			 * 初始化物料签收详情信息
			 */
			async init() {
				let res = await api.purchaseSignDetail({
					id: this.id
				});
				let str = '';
				res.data.result.signDetailDTO.materials.forEach(result => {
					result.paramArr = [];
					str = '';
					result.param = JSON.parse(result.param);
					for (let i in result.param) {
						result.paramArr.push({
							'unit': i,
							'value': result.param[i]
						});
						str = str + i + '：' + result.param[i] + '/';
					}
					str = str.substring(0, str.length - 1);
					result.paramstr = str;
				})
				for (let i = 0; i < res.data.result.signDetailDTO.materials.length; i++) {
					this.$set(res.data.result.signDetailDTO.materials[i], 'workproedure', {});
					this.$set(res.data.result.signDetailDTO.materials[i], 'signInNum', '');
				}
				this.signInfo = res.data.result;
				this.getdefaultworkproedure();
			},
			/**
			 * 查看批次悬浮窗打开触发事件
			 */
			batchOpen:function(){
				this.batchType = true;
			},
			/**
			 * 查看批次悬浮窗关闭触发事件
			 */
			batchClose:function(){
				this.batchType = false;
			},
			/**
			 * 物料信息弹窗打开触发事件
			 */
			materialOpen:function(){
				this.materialType = true;
			},
			/**
			 * 物料信息弹窗关闭触发事件
			 */
			materialClose:function(){
				this.materialType = false;
			},

			/**
			 * 收货数量触发改变事件
			 */
			signInNumChange: function(e, index) {
				this.$set(this.signInfo.signDetailDTO.materials[index], 'signInNum', e.detail.value);
				// console.log(e.detail.value,index);
			},
			/**
			 * 选择工序触发事件
			 */
			goworkproedure: function(index) {
				getApp().globalData.selected = {
					index: index,
					info: {}
				};
				uni.navigateTo({
					url: '/subcontractList/order/workprocedure/index/index'
				});
			},
			/**
			 * 获取默认工序触发事件
			 */
			getdefaultworkproedure: function() {
				let signInfo = this.signInfo;
				api.processesList({
					search: '0001',
					currentPage: 1,
					pageSize: 15
				}).then(res => {
					this.processesInfo = res.data.result[0];
					for (let i = 0; i < signInfo.signDetailDTO.materials.length; i++) {
						this.$set(signInfo.signDetailDTO.materials[i], 'workproedure', res.data.result[0]);
					}
					this.signInfo = signInfo;
				})
			},
			/**
			 * 扫库位码签收触发事件
			 */
			async signfor() {
				let signInfo = this.signInfo;
				let that = this;
				for (let i = 0; i < signInfo.signDetailDTO.materials.length; i++) {
					if (signInfo.signDetailDTO.materials[i].signInNum == '') {
						uni.showToast({
							title: '请填写收货数量',
							icon: 'none',
							duration: 2000
						});
						return;
					}
				}
				let res = await uni.showModal({
					title: '温馨提示',
					content: '确定使用收货区：收货区默认库位收货',
					cancelText: '扫码添加',
					confirmText: '确认使用'
				});
				if (res[1].confirm) {
					await this.getstoreDefaultHouses();
					if (signInfo.signDetailDTO.mergeType == "2" && this.storehouseInfo.id) {
						await this.signInStorehouses();
					} else if (signInfo.signDetailDTO.mergeType != "2") {
						this.signIn();
					}

				} else if (res[1].cancel) {
					that.getscanCode();
				}

				console.log(res);
				// uni.showModal({
				// 	title: '温馨提示',
				// 	content: '确定使用收货区：收货区默认库位收货',
				// 	cancelText: '扫码添加',
				// 	confirmText: '确认使用',
				// 	success: function(res) {
				// 		if (res.confirm) {
				// 			if(signInfo.signDetailDTO.mergeType == "2"){
				// 				that.getstoreDefaultHouses();
				// 			}

				// 		} else if (res.cancel) {
				// 			console.log('用户点击取消');
				// 			that.getscanCode();
				// 		}
				// 	}
				// });
			},
			/**
			 * 获取默认库位
			 */
			async getstoreDefaultHouses() {
				let res = await api.getStorehouses({
					search: 'SHQ-001',
					warehouseId: '',
					status: '',
					currentPage: 1,
					pageSize: 15
				}, 'default');
				if (res.data.result.length > 0) {
					this.storehouseInfo = res.data.result[0];
				} else {
					uni.showToast({
						title: '暂未找到默认库位，请使用扫码添加',
						icon: 'none',
						duration: 2000
					});
				}
			},
			/**
			 * 库位详情
			 */
			getStorehouses: function(id) {
				api.getStorehouses({
					id: id
				}, 'only').then(res => {
					this.storehouseInfo = res.data;
					this.storehousesType = true;
				})
			},
			/**
			 * 库位确认分发
			 */
			async signInStorehouses() {
				let that = this;
				let signInfo = this.signInfo;
				let data = {
					id: this.id,
					purchaseId: signInfo.signDetailDTO.purchaseId,
					signMaterialReqs: []
				};
				for (let i = 0; i < signInfo.signDetailDTO.materials.length; i++) {
					if (signInfo.signDetailDTO.materials[i].signInNum != '') {
						data.signMaterialReqs.push({
							actualReceiveCount: signInfo.signDetailDTO.materials[i].signInNum,
							materialId: signInfo.signDetailDTO.materials[i].materialId
						});
					}
				}
				let res = await api.signInDistribute(data);
				res.data.forEach(result => {
					for (let i = 0; i < result.purchaseDistributeMaterials.length; i++) {
						result.purchaseDistributeMaterials[i].storehouseInfo = that.storehouseInfo;
						result.purchaseDistributeMaterials[i].processesInfo = that.processesInfo;
					}
				})
				getApp().globalData.info = {
					signInfo: this.signInfo,
					distributeinfo: res.data,
					processesInfo: that.processesInfo,
					storehouseInfo: that.storehouseInfo
				};
				uni.redirectTo({
					url: '/subcontractList/order/purchase/waitbill/receive/receive?id=' + data.id
				});
			},
			signIn: function() {
				// {"id":"1518161877898305538","purchaseId":"1518161412367745024","signMaterialReqs":[{"actualReceiveCount":"3","id":"1518161877919277057","materialId":"1506096646394916864","materialNo":"WL-202203221078815160","processId":"1390584953820942341","processNo":"0001","storehouseId":"1390584953946771457","twoNumber":""}]}
				let that = this;
				let signInfo = this.signInfo;
				let storehouseInfo = this.storehouseInfo;
				let processesInfo = this.processesInfo;
				let data = {
					id: this.id,
					purchaseId: signInfo.signDetailDTO.purchaseId,
					signMaterialReqs: []
				};
				for (let i = 0; i < signInfo.signDetailDTO.materials.length; i++) {
					if (signInfo.signDetailDTO.materials[i].signInNum != '') {
						data.signMaterialReqs.push({
							actualReceiveCount: signInfo.signDetailDTO.materials[i].signInNum,
							materialId: signInfo.signDetailDTO.materials[i].materialId,
							id:signInfo.signDetailDTO.materials[i].id,
							materialNo:signInfo.signDetailDTO.materials[i].materialNo,
							processId: processesInfo.id,
							processNo: processesInfo.processNo,
							storehouseId: storehouseInfo.id,
							twoNumber: ""
						});
					}
				}
				api.purchaseSignIn(data).then(res => {
					uni.showToast({
						title: '签收成功',
						mask: true,
						duration: 2000,
						complete() {
							getApp().globalData.info = res.data;
							setTimeout(function() {
								uni.redirectTo({
									url: '/subcontractList/order/batch/index/index'
								});
							}, 2000)
						}
					});
				});
				console.log(data);
			},
			/**
			 * 库位悬浮窗关闭触发事件
			 */
			storehousesClose: function() {
				this.storehousesType = false;
			},

			/**
			 * 签收物料触发事件
			 */
			getscanCode: function() {
				let that = this;
				uni.scanCode({
					success: function(res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
						let data = getUrlJson(res.result);
						console.log(getUrlJson(res.result));
						if (data.t == 'STOREHOUSE') {
							// 物料签收
							that.getStorehouses(data.id);
						} else {
							uni.showToast({
								title: '暂不支持该类型二维码',
								icon: 'none',
								duration: 2000
							});
						}
					}
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page{
		background-color: #f6f6f6;
		min-height: 100vh;
	}
	.expressinfo-box{
	.cell-item{
		display: flex;
		justify-content: space-between;
		background-color: white;
		padding: 0 20rpx;
		box-sizing: border-box;
		line-height:80rpx;
		font-size: 28rpx;
		border-bottom: 1px solid #f0f0f0;
	 }
	}
	.product-box{
		margin-top: 20rpx;
		background-color: white;
		.title{
			 line-height:80rpx;
			 position: relative;
			 padding-left: 40rpx;
			 border-bottom: 1px solid #f0f0f0;
		}
		.title::before{
			content: '';
			width: 4rpx;
			height: 40%;
			background-color: #30a875;
			position: absolute;
			top:30%;
			left: 20rpx;
		}
		.card-item{
			padding: 20rpx;
			display: flex;
			.product-img{
				width: 150rpx;
				height: 150rpx;
				overflow: hidden;
				background-color:#eeeeee;
				.img{
					width: 60%;
					height: 60%;
					display: block;
					margin:20% 20%;
				}
			}
			.product-info{
				font-size: 26rpx;
				margin-left: 20rpx;
				.product-name{
					color: #ff4400;
					font-size:32rpx;
				}
				.info{
					display: flex;
					.item{
						color: #6a5acd;
						margin-right: 20rpx;
					}
				}
			}
		}
		.received-box{
			font-size: 28rpx;
			padding: 0 20rpx;
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;
			.left-box{
				display: flex;
				.received-title{
					color: #9f9f9f;
				}
				.received-num{
					color:#009900;
				}
			}
		}
		.cell-item{
			position: relative;
			padding: 0 20rpx;
			box-sizing: border-box;
			font-size: 28rpx;
			.left-box{
				display: flex;
				.cell-title{
					line-height: 80rpx;
				}
				.input{
					width: 150rpx;
					height: 80rpx;
					border-radius:10rpx;
					border:1px solid #afafaf;
				}
				.sign{
					padding-left:10rpx;
					line-height: 80rpx;
				}
			}
			.right-box{
				position: absolute;
				top:- 40rpx;
				right:20rpx;
				.cell-title{
					text-align: center;
				}
				.value{
					background-color: #f6f6f6;
					line-height: 80rpx;
					padding: 0 20rpx;
				}
			}	
		 }
		 .remark{
			 padding: 0 20rpx;
			 line-height:60rpx;
			 font-size: 28rpx;
		 }
	}
	.button-box{
		background-color: #f6f6f6;
		width: 100%;
		bottom:0;
		box-sizing: border-box;
		position: fixed;
		padding: 20rpx;
		padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx);
		padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
		.button{
			width: 100%;
			line-height:80rpx;
			border-radius:5rpx;
			background-color:#4169e1;
			text-align: center;
			color: white;
		}
	}
</style>
